<template>
	<div>
		<v-header :headerLeftText="leftText" :headerCenterText="headerText"></v-header>

		<div class="container bgd_color_gray">
			<div class="pad_lr26 bgd_color_white line_height86 border_bot1 f_size20">
				<img class="margin_rg20" src="../static/images/revisePwd.png" />
				<input v-model="oldPass" class="border_none line_height86 box_size_border" type="text" placeholder="请输入旧登录密码" />
			</div>
			<div class="pad_lr26 bgd_color_white line_height86 border_bot1 f_size20">
				<img class="margin_rg20" src="../static/images/revisePwd.png" />
				<input v-model="newPass" class="border_none line_height86 box_size_border" type="text" placeholder="请输入新登录密码" />
			</div>
			<div class="pad_lr26 bgd_color_white line_height86 f_size20">
				<img class="margin_rg20" src="../static/images/revisePwd.png" />
				<input v-model="againNewPass" class="border_none line_height86 box_size_border" type="text" placeholder="再次输入登录密码" />
			</div>
			<div class="pad_lr20_tb10 pad_t110">
				<button @click="modifyClick" class="login_btn bgd_color_main f_color_white f_size26">修改</button>
			</div>
		</div>

	</div>
</template>
<script>
	import { Toast } from 'mint-ui';
	
	export default {
		data() {
			return {
				leftText: '',
				headerText: '修改登录密码',
				oldPass: "",
				newPass: "",
				againNewPass: ""
			}
		},
		methods: {
			modifyClick: function() {
				var self = this
				console.log('this.newPass', this.newPass)
				console.log('this.againNewPass', this.againNewPass)

				if(this.newPass != this.againNewPass) {
					Toast('再次输入的新密码不一致')
					return false
				}
				this.$api.post('/front/users/modifyPass', {
					oldPass: this.oldPass,
					newPass: this.newPass
				}, r => {
					if(r.code === 400) {
						Toast(r.error)
					} else {
						Toast(r.data)
						setTimeout(function(){
							self.$router.back(-1)
						}, 1500)
					}
				})
			}
		}
	}
</script>